<template>
  <div class="home">
    <my-input @addTask="addTask" placeholder="请输入内容">
      <template #left>
        <h2>TODOlist</h2>
      </template>
    </my-input>
    <my-list :arrTask="arrTask">
      <h2>正在进行中</h2>
    </my-list>
    <my-list>
      <h2>已经完成</h2>
    </my-list>
    <my-list>
      <h2>全部任务</h2>
    </my-list>
  </div>
</template>

<script>
import myList from "../components/myList.vue";
import myInput from "../components/myInput.vue";
import { ref, reactive, toRefs } from "vue";
import { useStore } from "vuex";
import { useRouter, useRoute } from "vue-router";
export default {
  setup(props, ctx) {
    const store = useStore();
    const router = useRouter();
    const route = useRoute();
    const data = reactive({
      title: "",
    });
    let arrTask = ref([
      {
        name:'工作摸鱼',
        complete:false
      },
        {
        name:'干饭',
        complete:false
      },
        {
        name:'国庆放假',
        complete:false
      }
    ])
    return { ...toRefs(data),arrTask };
  },
  components: {
    myInput,
    myList,
    
  },
};
</script>

<style lang='scss'>
</style>



